<div class="hy-layout clearfix">
    <div class="hy-video-head">
        <h3 class="margin-0">
            <i class="icon iconfont icon-xiaoxi text-color"></i>影片评论
        </h3>
        <span *ngIf="comments.total" class="text-muted pull-right">
            第<span class="text-color size-xs">{{comments.current_page}}/{{comments.last_page}}</span>页
        </span>
        <span *ngIf="!loading" class="text-muted pull-right">(暂无评论)</span>
    </div>
    <div class="row comment-list-group">
        <div *ngFor="let item of comments['data']; let key = index" class="comments-list">
            <div class="comment-wrap">
                <div class="comment comment1">
                    <div class="comment-user-content">
                        <div class="comment-user-img" style="background-image: url(/assets/images/man.png);"></div>
                        <p class="size-s c-default text-center"></p>
                    </div>
                    <div class="comment-content">
                        <div class="comment-header"><!---->
                            <p class="hot-icon pull-right size-xs c-white bg-red">{{comments.last_page - comments.current_page + comments.data.length - key}}
                                樓</p>
                            <span class="size-m font-bold c-default"> {{item.nickname}} </span>
                        </div>
                        <div class="comment-body">
                            <span class="size-m">{{item.content}}</span>
                        </div>
                        <div class="comment-child-body border-gai comment-{{item.id}}">
                            <div *ngFor="let val of item['child']['data']; let i = index"
                                 class="comment {{i>2 ? 'comment-hide' : ''}}">
                                <div class="comment-content child-{{i}}">
                                    <div class="comment-header">
                                        <span class="size-m font-bold c_default">{{val.nickname}}: </span>
                                        <span class="pull-right size-s c_default">{{Service.getDate(val.create_time)}}</span>
                                    </div>
                                    <div class="comment-body size-s">{{val.content}}</div>
                                </div>
                            </div>
                            <div *ngIf="item['child']['total'] > 3" (click)="showMore(item.id)" class="comment-footer1">
                                <a class="size-s" title="查看全部">查看全部<i
                                        class="icon iconfont icon-right size-s"></i></a>
                            </div>
                        </div>
                    </div>
                    <div class="comment-footer">
                        <span class="pull-left size-s c-default">{{Service.getDate(item.create_time)}}</span>
                        <a class="comment-reply size-xs" (click)="liked(item.id, key)" title="点赞">
                            <span>{{item.goods ? item.goods : ''}}</span><i
                                class="icon iconfont icon-dianzan"></i></a>
                        <a (click)="setParent(item.id,item.uid,item.nickname, key)" class="comment-reply" title="回复"><i
                                class="icon iconfont icon-xiaoxi"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <app-paginator (toLink)="goLink($event)" [total]="comments.total"
                       [pageSize]="comments.per_page" [totalPage]="comments.last_page"
                       [curPage]="comments.current_page" [channel]="'comment'"></app-paginator>
        <div *ngIf="!comments.total" class="page-default">
            <span class="loading" *ngIf="loading"></span>
        </div>
    </div>

    <div id="post-content">
        <form method="post" (ngSubmit)="comment();">
            <textarea [(ngModel)]="commentInfo.content" name="content" class="content" id="content"
                      placeholder="评论内容不能包含联系方式，和言语辱骂等不良言论等不良言论，一经发现从严处理">
            </textarea>
            <li>
                <input class="form-control pull-left" [(ngModel)]="commentInfo.verify" name="verify" type="text"
                       placeholder="验证码" style="width:80px;text-transform:uppercase;border: 1px solid #fe4159;">
                <img class="pull-left" title="刷新验证码" style="height:35px; width: 80px; border-radius: 4px;border: 1px solid #fe4159;"
                     (click)="getCode()" src="{{verify}}">
                <button type="submit" style="width: 150px" class="btn btn-block btn-warning post-comment pull-right">提&nbsp;&nbsp;&nbsp;交</button>
            </li>
        </form>
    </div>
</div>
